//layui模块的定义
layui.define(["jquery"], function (exports) {

    //JavaScript代码区域
    layui.use('element', function () {
        var element = layui.element;


        var $ = layui.jquery,
            element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

        //触发事件
        var active = {
            tabAdd: function () {
                //新增一个Tab项
                element.tabAdd('demo', {
                    title: '新选项' + (Math.random() * 1000 | 0) //用于演示
                        ,
                    content: '内容' + (Math.random() * 1000 | 0),
                    id: new Date().getTime() //实际使用一般是规定好的id，这里以时间戳模拟下
                })
            },
            tabDelete: function (othis) {
                //删除指定Tab项
                element.tabDelete('demo', '44'); //删除：“商品管理”


                othis.addClass('layui-btn-disabled');
            },
            tabChange: function () {
                //切换到指定Tab项
                element.tabChange('demo', '22'); //切换到：用户管理
            }
        };

        $('.site-demo-active').on('click', function () {
            var othis = $(this),
                type = othis.data('type');
            active[type] ? active[type].call(this, othis) : '';
        });

        //Hash地址的定位
        var layid = location.hash.replace(/^#test=/, '');
        element.tabChange('test', layid);

        element.on('tab(test)', function (elem) {
            location.hash = 'test=' + $(this).attr('lay-id');
        });



        //自定义代码

        $(".layui-nav-item dd").on("click", "a", function () {

            let tabTitle = $(this).data("title");
            let tabUrl = $(this).data("url");
            let tabId = $(this).data("id");
            console.log(tabId);

            let mainHeight = $(document).height() - $(".layui-header").height() - $(".layui-footer").height() - $(".layui-tab-title").height() - 35;


            if ($("li[lay-id=" + tabId + "]").length > 0) {
                element.tabChange('demo', tabId);
            } else {
                element.tabAdd('demo', {
                    title: tabTitle, //用于演示
                    content: '<iframe id="mainIframe"  height="' + mainHeight + 'px" width="100%" src="' + tabUrl + '" frameborder="0" scrolling="no" ></iframe>',
                    id: $(this).data("id") //实际使用一般是规定好的id，这里以时间戳模拟下
                })

                // console.log($(this).data("id"))
                element.tabChange('demo', tabId); //切换到：用户管理
            }


        })


        $(window).on("resize", function () {
            let mainHeight = $(window).height() - $(".layui-header").height() - $(".layui-footer").height() - $(".layui-tab-title").height() - 35;
            $("#mainIframe").height(mainHeight);
        })

    });




});